.number-box {
    position: relative;
    transition: transform 0.3s ease;
}

.number-box.current-card {
    background-color: #f99737;
    transform: translateY(-20px) scale(1.1);
    box-shadow: 0 8px 16px rgba(0,0,0,0.2);
    z-index: 2;
}

.number-box.comparing {
    background-color: #4299e1;
    transform: scale(1.05);
}

.number-box.sorted {
    background-color: #48bb78;
}

/* 扑克牌效果 */
.number-box::before {
    content: '';
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border: 2px solid rgba(255,255,255,0.3);
    border-radius: 5px;
    pointer-events: none;
}

/* 插入动画 */
@keyframes slideIn {
    0% { transform: translateX(var(--start-x)) translateY(-20px); }
    50% { transform: translateX(var(--end-x)) translateY(-20px); }
    100% { transform: translateX(var(--end-x)) translateY(0); }
}

.number-box.inserting {
    animation: slideIn 0.5s ease forwards;
}

/* 移动动画 */
@keyframes shiftRight {
    from { transform: translateX(0); }
    to { transform: translateX(70px); }
}

.number-box.shifting {
    animation: shiftRight 0.3s ease forwards;
} 